<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>茶茶商城-购物车</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
    <link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="assets/fonts/ionicons.min.css">
    <link rel="stylesheet" href="assets/fonts/fontawesome5-overrides.min.css">
    <link rel="stylesheet" href="assets/css/animated-textbox3-1.css">
    <link rel="stylesheet" href="assets/css/animated-textbox3.css">
    <link rel="stylesheet" href="assets/css/Beautiful-Alert.css">
    <link rel="stylesheet" href="assets/css/Carousel_Image_Slider-1.css">
    <link rel="stylesheet" href="assets/css/Carousel_Image_Slider.css">
    <link rel="stylesheet" href="assets/css/Customizable-Carousel-swipe-enabled.css">
    <link rel="stylesheet" href="assets/css/Elegant-Registration-Form.css">
    <link rel="stylesheet" href="assets/css/Footer-Clean.css">
    <link rel="stylesheet" href="assets/css/Grid-and-List-view-V10-1.css">
    <link rel="stylesheet" href="assets/css/Grid-and-List-view-V10.css">
    <link rel="stylesheet" href="assets/css/Lista-Productos-Canito.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Clean.css">
    <link rel="stylesheet" href="assets/css/Multi-step-form.css">
    <link rel="stylesheet" href="assets/css/Navigation-with-Search.css">
    <link rel="stylesheet" href="assets/css/Pretty-Product-List.css">
    <link rel="stylesheet" href="assets/css/Pretty-Registration-Form.css">
    <link rel="stylesheet" href="assets/css/Pretty-Search-Form.css">
    <link rel="stylesheet" href="assets/css/Product-Details.css">
    <link rel="stylesheet" href="assets/css/Registration-Form-with-Photo.css">
    <link rel="stylesheet" href="assets/css/Search-Input-Responsive-with-Icon.css">
    <link rel="stylesheet" href="assets/css/styles.css">
</head>

<body>
  <nav class="navbar navbar-light navbar-expand-md shadow-sm">
    <div class="container"><a class="navbar-brand" href="index.html">茶茶商城</a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-2"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
        <div class="collapse navbar-collapse" id="navcol-2">
            <ul class="navbar-nav ms-auto" id="nav_ul">
                <li class="nav-item"><a class="nav-link active" href="index.html">产品</a></li>
                <li class="nav-item"><a class="nav-link" href="cart.html">购物车</a></li>
                <li class="nav-item"><a class="nav-link" href="order.html">我的订单</a></li>
                <li class="nav-item"><a class="nav-link" href="login.html" id="nav_login">登录</a></li>
                <li class="nav-item"><a class="nav-link" href="register.html" id="nav_register">注册</a></li>
            </ul>
        </div>
    </div>
</nav>
    <div class="container mt-5"><div class="shopping-cart">
<div class="px-4 px-lg-0">

  <div class="pb-5">
    <div class="container">
      <div class="row">
        <div class="col-lg-12 p-5 bg-white rounded shadow-sm mb-5">

          <!-- Shopping cart table -->
          <div class="table-responsive">
            <table class="table">
              <thead>
                <tr>
                  <th scope="col" class="border-0 bg-light">
                    <div class="p-2 px-3 text-uppercase">商品</div>
                  </th>
                  <th scope="col" class="border-0 bg-light">
                    <div class="py-2 text-uppercase">价格</div>
                  </th>
                  <th scope="col" class="border-0 bg-light">
                    <div class="py-2 text-uppercase">数量</div>
                  </th>
                  <th scope="col" class="border-0 bg-light">
                    <div class="py-2 text-uppercase">删除</div>
                  </th>
                </tr>
              </thead>
              <tbody id="carts">
 
              </tbody>
            </table>
          </div>
          <!-- End -->
        </div>
      </div>

      <div class="row py-5 p-4 bg-white rounded shadow-sm">
        <div class="col-lg-6">
          <div class="bg-light rounded-pill px-4 py-3 text-uppercase font-weight-bold">优惠券代码</div>
          <div class="p-4">
            <p class="font-italic mb-4">如果您有优惠券代码，请在下面的框中输入</p>
            <div class="input-group mb-4 border rounded-pill p-2">
              <input type="text" placeholder="输入优惠码" aria-describedby="button-addon3" class="form-control border-0">
              <div class="input-group-append border-0">
                <button id="button-addon3" type="button" class="btn btn-dark px-4 rounded-pill"><i class="fa fa-gift mr-2"></i>应用</button>
              </div>
            </div>
          </div>
          <div class="bg-light rounded-pill px-4 py-3 text-uppercase font-weight-bold">卖家须知</div>
          <div class="p-4">
            <p class="font-italic mb-4">请输入您的物流地址</p>
            <textarea name="" cols="30" rows="2" class="form-control" placeholder="XX省XX市XX区XX街道XXXXXX  +86 1111-111-111  XX 先生/女生" id="address"></textarea>
          </div>
        </div>
        <div class="col-lg-6">
          <div class="bg-light rounded-pill px-4 py-3 text-uppercase font-weight-bold">订单摘要 </div>
          <div class="p-4">
            <p class="font-italic mb-4">运费和额外费用是单独计算的。</p>
            <ul class="list-unstyled mb-4">
              <li class="d-flex justify-content-between py-3 border-bottom"><strong class="text-muted">订单小计</strong><strong id="money">$390.00</strong></li>
              <li class="d-flex justify-content-between py-3 border-bottom"><strong class="text-muted">运费和手续费</strong><strong>$0.00</strong></li>
              <li class="d-flex justify-content-between py-3 border-bottom"><strong class="text-muted">税</strong><strong>$0.00</strong></li>
              <li class="d-flex justify-content-between py-3 border-bottom"><strong class="text-muted">全部</strong>
                <h5 class="font-weight-bold"  id="all_money">0.00</h5>
              </li>
            </ul><a href="#" class="btn btn-dark rounded-pill py-2 btn-block" onclick="post_from()">提交订单</a>
          </div>
        </div>
      </div>

    </div>
  </div>
</div>
</div></div>
    <footer class="footer-clean">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-sm-4 col-md-3 item">
                    <h3>服务</h3>
                    <ul>
                        <li><a href="#">订单查询</a></li>
                        <li><a href="#">物流查询</a></li>
                        <li><a href="#">在线客服</a></li>
                    </ul>
                </div>
                <div class="col-sm-4 col-md-3 item">
                    <h3>关于我们</h3>
                    <ul>
                        <li><a href="#">公司简述</a></li>
                        <li><a href="#">团队</a></li>
                        <li><a href="#">资产</a></li>
                    </ul>
                </div>
                <div class="col-sm-4 col-md-3 item">
                    <h3>联系我们</h3>
                    <ul>
                        <li><a href="#"><i class="fa fa-phone-square"></i><span>&nbsp; +86 15375984932</span></a></li>
                        <li><a href="#"><i class="fas fa-mail-bulk"></i><span>&nbsp;2949027426@qq.com</span></a></li>
                        <li><a href="#">福建省莆田市涵江区XXX</a></li>
                    </ul>
                </div>
                <div class="col-lg-3 item social"><a href="#"><i class="icon ion-social-facebook"></i></a><a href="#"><i class="icon ion-social-twitter"></i></a><a href="#"><i class="icon ion-social-snapchat"></i></a><a href="#"><i class="icon ion-social-instagram"></i></a>
                    <p class="copyright">Company Name © 2022</p>
                </div>
            </div>
        </div>
    </footer>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="assets/js/Customizable-Carousel-swipe-enabled.js"></script>
    <script src="assets/js/Grid-and-List-view-V10.js"></script>
    <script src="assets/js/Multi-step-form.js"></script>
    <script src="assets/js/check_login_order.js"></script>
    <script src="assets/js/cart.js"></script>
</body>

</html>